import React, {Component} from 'react';
import {Table, Pagination, Loading} from '@icedesign/base';
import IceContainer from '@icedesign/container';

import EditDialog from "./EditDialog";
import CustomTable from './CustomTable'
import {Feedback} from '@icedesign/base';

export const NameMap = {
  'STA_NAME': '车站名称',
  'STA_LINENAME': '线路名称',
  'OUCode': '机构代码',
  'OUName': '机构名称',
  'STA_ORDER': 'STA_ORDER',
  'STA_ATTRIB': 'STA_ATTRIB',
};


export default class SearchTable extends Component {
  static displayName = 'SearchTable';

  static propTypes = {};

  static defaultProps = {};

  constructor(props) {
    super(props);
    // let page = {current: 1, pageSize: 10, years: [], deviceType: []};
    this.state = { // 默认分页数据
      current: 1,
      pageSize: 10,
      data: {},
      staName: [],
      ouName: []
    }

    this.columns = [
      {
        title: NameMap['STA_NAME'],
        dataIndex: 'STA_NAME',
        key: 'STA_NAME',
      },
      {
        title: '操作',
        key: 'action',
        render: (value, index, record) => {
          // console.log(value, index, record) // value: 不清楚false， index是数组序号 0，  record是一条数据，{id: 1, YMonth: "2018", DeviceType: "106100", STA_NAME: "信阳驼峰站", ORG1_ID: "103", …}
          return (
            <span>
              <EditDialog
                // index={index}
                // index={record.STA_ID} // id值方便回传
                record={record}
                updateFormValues={this.updateFormValues} // todo 绑定弹窗的方法
              />

            </span>
          );
        },
      },
    ];
  }



  updateFormValues = (values) => {
    console.log(values)


  };



  render() {
    // console.log(11111111, this.props.bindingData)
    const dataSource = {"ListResult":[{"STA_NAME":"TEST"},{"STA_NAME":"TEST1"},{"STA_NAME":"TEST2"},{"STA_NAME":"TEST3"}]}; // SendData 是 binder方法的key
    // console.log(22222222,dataSource);

    // todo CustomTable 是包装一层返回的table组件， 同时生成列头
    // Loading 加载动画
    return (
      <IceContainer style={styles.container}>
        <h4 style={styles.title}>测试数据</h4>

          <div>
            <CustomTable
              dataSource={dataSource.ListResult}
              columns={this.columns}
              hasBorder={false}
              // optimization={false}
            />

          </div>

      </IceContainer>
    );
  }
}

const styles = {
  container: {
    margin: '20px',
    padding: '0 0 20px',
  },
  title: {
    margin: '0',
    padding: '15px 20px',
    fonSize: '16px',
    textOverflow: 'ellipsis',
    overflow: 'hidden',
    whiteSpace: 'nowrap',
    color: 'rgba(0,0,0,.85)',
    fontWeight: '500',
    borderBottom: '1px solid #eee',
  },
  link: {
    margin: '0 5px',
    color: 'rgba(49, 128, 253, 0.65)',
    cursor: 'pointer',
    textDecoration: 'none',
  },
  separator: {
    margin: '0 8px',
    display: 'inline-block',
    height: '12px',
    width: '1px',
    verticalAlign: 'middle',
    background: '#e8e8e8',
  },
  pagination: {
    textAlign: 'right',
    marginRight: '20px',
  },
};
